import request from '../../../utils/request'
import moment from 'moment'
import PubSub from 'pubsub-js'
const appInst =  getApp();

Page({
  /**
   * 页面的初始数据
   */
  data: {
    isPlay: false, //音乐是否播放
    song: {}, //歌曲详情对象
    musicId: '', //当前音乐ID
    musicLink: '', //记录音乐链接，避免重复请求
    currentTime: '00:00', //当前播放时长
    durationTime: '00:00', //歌时长
    currentWidth: 0   //实时进度条
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    //路由传参由option获取，传参时必须是个JSON
    let musicId = options.musicId;
    this.setData({
      musicId
    })
    this.getMusicInfo(musicId)
    //问题：用户操作系统的控制音乐器按钮，而自己设置的页面不知道，导致不一致
    
    //判断进去页面时音乐是否正在播放中，歌是否为同一首
    if(appInst.globaData.isMusicPlay && appInst.globaData.musicId == musicId) {
      this.setData({
        isPlay: true
      })
    }
  

    // 通过创建背景音频实例同步控制
    this.backgroundAudioManager = wx.getBackgroundAudioManager();
    this.backgroundAudioManager.onPlay(() => {
      this.changePlayState(true)
     //修改全局的音乐播放的状态 globeData
      appInst.globaData.musicId = musicId;
    })
    this.backgroundAudioManager.onPause(() => {
      this.changePlayState(false)
    })  
    this.backgroundAudioManager.onStop(() => {
      this.changePlayState(false)
    })  
    //监听音乐播放自然结束
    this.backgroundAudioManager.onEnded(() => {
      // 自动切换下一首并且自动播放
      PubSub.publish('switchType', 'next')
      //且进度条为0
      this.setData({
        currentTime: '00:00',
        currentWidth: 0
      })
    })  
    //监听音乐实时播放的进度
    this.backgroundAudioManager.onTimeUpdate(()=>{
      let currentTime = moment(this.backgroundAudioManager.currentTime * 1000).format('mm:ss')
      let currentWidth = this.backgroundAudioManager.currentTime / this.backgroundAudioManager.duration * 450 
      //判断是否为同一首歌，是就不更新数据
      if(appInst.globaData.isMusicPlay && appInst.globaData.musicId !== musicId) {
        this.setData({
          currentWidth: 0
        })
        return;
      }
      // 更新到data
      this.setData({
        currentTime,
        currentWidth
      })
      
    });
  },
  //修改播放的功能函数
  changePlayState(isPlay) {
    this.setData({
      isPlay
    })
    appInst.globaData.isMusicPlay = isPlay;
  },
  //获取音乐详情回调
  async getMusicInfo(musicId) {
     let songData = await request('/song/detail', { ids: musicId })
     //songData.songs[0].dt 毫秒  
     let durationTime = moment(songData.songs[0].dt).format('mm:ss')
    this.setData({
      song: songData.songs[0],
      durationTime
    })
    //动态修改窗口标题
    wx.setNavigationBarTitle({
      title: this.data.song.name
    });
  },
  //播放按钮点击回调
  handleMusicPlay() {
    //上面有背景音乐器控制，不需要重复了
    // this.setData({
    //   isPlay: !this.data.isPlay
    // })
    let { musicId, musicLink } = this.data
    this.musicControl(!this.data.isPlay, musicId, musicLink)
  },
  //播放按钮的功能函数
  async musicControl(isPlay, musicId, musicLink) {
    if(isPlay) { //音乐播放
      //获取音乐播放数据
      if(!musicLink) {
      let musicLinkData = await request('/song/url', {id: musicId})
      musicLink = musicLinkData.data[0].url
      this.setData({
        musicLink
      })
      }
      
      // properties(Read only)(duration,currentTime,paused,buffered)
      // properties(src(m4a, aac, mp3, wav),startTime,title,epname,singer,coverImgUrl,webUrl,protocol)
      this.backgroundAudioManager.title = this.data.song.name
      this.backgroundAudioManager.src = musicLink
    }else { //音乐暂停
      this.backgroundAudioManager.pause();
    }

  },
  // 切歌回调
  handleSwitch(evnet) {
    let type = evnet.currentTarget.id
    //关闭当前音乐
    this.backgroundAudioManager.stop();
    //将切歌是上一首或下一首的类型发布
    PubSub.publish('switchType', type)
    //订阅Recommend的发布
    PubSub.subscribe('musicId', (msg, musicId) => {
      //获取信息
      this.getMusicInfo(musicId)
      //自动播放
      this.musicControl(true, musicId, false)
      //取消订阅
      PubSub.unsubscribe('musicId')
    })
  },
  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})